import  {defineStore} from 'pinia'

import { showData,detailData } from '@/api/banner'
import {proLimit} from '../api/pro'
import { addDD } from '@/api/gouwu'
import { showDialog } from 'vant'

type state = {
    productList:listType[],
    count:number,
    flag:boolean
    logins:string,
    bannerData:bannerType[],
    danData:listType|null,
    route:string,
    imgList:Array<string>,
    names:number,
    fanhui:boolean,
    scrollTop:number
}
export const useProductStore = defineStore(
    "product-store",
    {
        state:():state=>{
            return {
                // 商品数据
                productList:[],
                // 商品页面
                count:0,
                // 关闭懒加载
                flag:false,
                // 首页头部的改变
                logins:'登录',
                bannerData:[],
                // 单个商品的详情
                danData:null,
                // 详情页商品id
                route:'',
                // 详情页图片
                imgList:[],
                // 切换详情模块组件
                names:0,
                // 是否返回登录
                fanhui:false,
                scrollTop:0
            }
        },
        getters:{

        },
        actions:{
            // 获取分页数据
            async fetchProductList(){
                this.count++;
                let res = await proLimit(this.count,10);
                this.productList = [...this.productList,...res.data]
                if(res.data<10){
                    this.flag=  true;
                }
            },
            // 判断是否存在账号 改变头部
            fetchChangeHeader(){
                if(localStorage.getItem('token')){
                    this.logins = '我的'
                }else{
                    this.logins = '未登录'
                }
            },
            // 获取轮播图数据
            async fetchBannerData(){
                if(this.bannerData.length){
                    return
                }
                let res =await showData();
                this.bannerData = res.data.filter(item=>item.img)
                
            },
            // 跳转到详情页
            async fetchDetailData(routes:string){
                // 获取到选中商品的详细id
                this.route = routes;
                // 判断商品分页列表数据是否存在该id
                let index = this.productList.findIndex(item=>item.proid == this.route);
                // 如果存在数据 不需要发送请求 直接获取
                if(index != -1){
                    this.danData = this.productList[index];
                    console.log('不需要请求');
                }else{
                // 如果不存在数据 发送请求 获取数据
                    let res = await detailData(this.route);
                    this.danData = res.data
                    console.log('需要请求');
                }
                this.imgList = [];
                this.imgList.push(this.danData.img1);
                this.imgList.push(this.danData.img2);
                this.imgList.push(this.danData.img3);
                this.imgList.push(this.danData.img4);
                
            },
            // 切换详情页的组件模块
            fetchChangeComponent(names:number){
                this.names = names;
            },
            // 当详情页点击添加购物车
            addData(){
                this.fanhui = false;
                // 如果存账号
                if(localStorage.getItem('userId')){
                    // 添加购物车信息在用户数据下
                    addDD(localStorage.getItem('userId') as string,this.route);
                    // 调出弹窗
                    showDialog({
                        message:'添加购物车成功'
                    })
                }else{
                    // 如果不存在账号
                    this.fanhui = true;
                }
            }
        }
    },
)
